﻿<script src="~/Scripts/jquery-easyui-extensions/cachePool/jeasyui.extensions.cachePool.js"></script>

<div class="easyui-panel" data-options="fit:true,border:false" style="padding:20px;">
    <input id="combobox1" type="text" value="" />
    <br />
    这是个加载远程数据的 combobox。
    <br /><br /><br />
    <a id="btnGet1" class="easyui-linkbutton" data-options="iconCls:'icon-add'">通过“reload”方法重新加载combobox的远程数据</a>
    <span style="color:red;font-weight:bolder;">调用combobox的源生reload方法，会自动判定缓存池，若存在则用缓存池中的数据作为数据源</span>
    <br /><br /><br />
    <a id="btnGet2" class="easyui-linkbutton" data-options="iconCls:'icon-add'">改变combobox的远程数据</a>
    <br /><br /><br />
    <a id="btnGet3" class="easyui-linkbutton" data-options="iconCls:'icon-add'">重置combobox的远程数据</a>

    <br /><br /><br />
    <a id="btnGet4" class="easyui-linkbutton" data-options="iconCls:'icon-add'">获取缓存池中的combobox缓存数据</a>
    <div id="cacheInfo">

    </div>
</div>
<script>
    $(function () {

        $.easyui.cachePool.clearCaches();

        var _loader = $.fn.combobox.defaults.loader;
        var loader = function (param, success, error) {
            var opts = $(this).combobox('options');
            if (!opts.url) return false;
            if (opts.loadFromCache) {
                var cache = $.easyui.cachePool.getCache(opts.url);
                if (cache) {
                    success(cache.data);
                    cache.lastComponent = "combobox";
                    cache.lastUseTime = new Date();
                    console.log("从缓存池加载缓存的远程数据成功。");
                    return;
                }
            }
            if ($.isFunction(_loader)) {
                _loader.apply(this, arguments);
                console.log("访问远程数据成功。");
            }
        };

        $("#combobox1").combobox({
            valueField: "value",
            textField: "text",
            url: "/CachePool/getComboboxData",
            multiple: false,
            editable: false,

            cacheToPool: true, //是否缓存远程数据到缓存池
            loadFromCache: true, //重新加载远程数据时是否先从缓存池取
            cacheInterval: 30, //缓存池这笔数据的有效时间，单位秒

            loader: loader,
            onLoadSuccess: function (data) {
                //console.log(data);
                var opts = $(this).combobox("options");
                if (opts.cacheToPool) {
                    $.easyui.cachePool.addCache(opts.url, {}, data, "combobox", opts.cacheInterval ? opts.cacheInterval : 30);
                    //var caches = $.easyui.cachePool.getCaches();
                    //console.log(caches);
                }
            },
            loadFilter: function (result) {
                return result;
            }
        });

        $("#btnGet1").click(function () {
            $("#combobox1").combobox("reload");
        });

        $("#btnGet2").click(function () {
            $.post("/CachePool/changeComboboxData");
        });

        $("#btnGet3").click(function () {
            $.post("/CachePool/resetComboboxData");
        });

        $("#btnGet4").click(function () {
            $("#cacheInfo").empty();
            console.log("获取缓存池：");
            console.log($.easyui.cachePool.getCaches());

            var cache = $.easyui.cachePool.getCache("/CachePool/getComboboxData");
            if (cache) {
                $("#cacheInfo").append("获取缓存成功。").append("<br /><br />");
                $("#cacheInfo").append("缓存数据长度：" + cache.data.length).append("<br /><br />");
                $("#cacheInfo").append("缓存数据的原始url：" + cache.url).append("<br /><br />");
                $("#cacheInfo").append("缓存数据的创建者：" + cache.createComponent).append("<br /><br />");
                $("#cacheInfo").append("缓存数据的创建时间：" + cache.createTime).append("<br /><br />");
                $("#cacheInfo").append("缓存数据的有效时间（秒）：" + cache.dropDataInterval).append("<br /><br />");
                $("#cacheInfo").append("缓存数据是否被重载过：" + cache.override).append("<br /><br />");
                $.array.forEach(cache.data, function (item) {
                    $("#cacheInfo").append(JSON.stringify(item));
                });
            } else {
                $("#cacheInfo").append("缓存池中无相关数据。");
            }
        });

    });
</script>
